<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>初始vue</title>
    <!-- 引入vue -->
    <script type="text/javascript" src="../js/vue.js"></script>
</head>

<body>
    <div id="app"></div>
    <script>
        // 获取 DIV 元素
        let box = document.querySelector('#app');
        console.log(box);

        // 真实 DOM 操作
        console.time('a');
        for (let i = 0; i <= 10000; i++) {
            box.innerHTML = i;
        }
        console.timeEnd('a');

        // 虚拟 DOM 操作
        let num = 0;
        console.time('b');
        for (let i = 0; i <= 10000; i++) {
            num = i;
        }
        box.innerHTML = num;
        console.timeEnd('b');

    </script>
</body>

</html>